$(function(){

  var page=1;
  pageSize=5;

  render()
  
  function render(){
    $.ajax({
      url:'/category/querySecondCategoryPaging',
      type:'get',
      data:{
        page:page,
        pageSize:pageSize
      },
      success:function(info){
        console.log(info);
        $('tbody').html( template('tmp',info))
  
        // 分页
        $("#paginator").bootstrapPaginator({
          bootstrapMajorVersion:3,
          currentPage:page,
          totalPages:Math.ceil(info.total/info.size),
          onPageClicked:function(e, o, t, p){
            //为按钮绑定点击事件 page:当前点击的按钮值
            page=p;
            render();
          }
        });
      }
    })
  }

  //点击添加分类,
  $('.btn-add').on('click',function(){
    // 显示模态框
    $('#addModal').modal('show')
    //ajax请求一级分类数据
    $.ajax({
      url:'/category/queryTopCategoryPaging',
      type:'get',
      data:{
        page:1,
        pageSize:666
      },
      success:function(info){
        $('.dropdown-menu').html( template('tmp2',info) )
      }
    })
  })

  //一级分类选择功能
  $('.dropdown-menu').on('click','li',function(){
    
    $('[name="categoryId"]').val($(this).data('id'));
    
    $('.dropdown_text').text($(this).children().text());

    // 手动校验
    $("form").data('bootstrapValidator')
    .updateStatus('categoryId', 'VALID')
  })


  // 文件上传,实现本地预览
  $("#file").fileupload({
    dataType:"json",
    //e：事件对象
    //data：图片上传后的对象，通过data.result.picAddr可以获取上传后的图片地址
    done:function (e, data) {
        var src=data.result.picAddr;
        console.log(src);
        $('.img_box img').attr('src',src);
        $('[name="brandLogo"]').val(src);
        // 手动校验
        $("form").data('bootstrapValidator')
        .updateStatus('brandLogo', 'VALID')  

    }
});


// 表单校验
$('form').bootstrapValidator({
  //指定不进行校验的类型
  excluded:[],

  // 指定校验图标
  feedbackIcons: {
    valid: 'glyphicon glyphicon-ok',
    invalid: 'glyphicon glyphicon-remove',
    validating: 'glyphicon glyphicon-refresh'
  },

  // 指定校验字段
  fields:{
    categoryId:{
      validators: {
        //不能为空
        notEmpty: {
          message: '请选择一级分类'
        },
      }
    },
    brandName:{
      validators: {
        //不能为空
        notEmpty: {
          message: '请输入二级分类的名称'
        },
      }
    },
    brandLogo:{
      validators: {
        //不能为空
        notEmpty: {
          message: '请上传品牌的图片'
        },
      }
    },
  }
})


// 注册表单校验成功事件
$("form").on('success.form.bv', function (e) {
  e.preventDefault();
  //使用ajax提交逻辑
  $.ajax({
    url:'/category/addSecondCategory',
    type:'post',
    data:$('form').serialize(),
    success:function(info){
      if(info.success){
        // 重新渲染第一页
        page=1;
        render();
        // 隐藏模态框
        $('#addModal').modal('hide')
        // 重置模态框样式(即重置表单中校验过的内容,隐藏提示和提示图标)
        $("form")
        .data('bootstrapValidator')
        .resetForm(true)
        //手动重置
        $('.dropdown_text').text('请选择一级分类');
        $('.img_box img').attr('src','./image/none.png')
      }
    }
  })
});

})